1. Obiectiv: Aplicație web pentru generarea și previzualizarea animațiilor CSS 3D în timp real.
2. Tehnologii: HTML5 Semantic, CSS3 (3D Transforms, Flexbox, Grid), Vanilla JavaScript (fără framework-uri externe).
3. Arhitectură: SPA (Single Page Application) cu state-management intern pentru gestionarea keyframe-urilor și a istoricului (Undo/Redo).
4. Implementare 3D: Utilizarea perspective și transform-style: preserve-3d pentru randarea formelor geometrice.
5. Export: Generare dinamică de cod CSS @keyframes și cod JavaScript (Web Animations API) pentru integrare rapidă în alte proiecte.
Logica Codului (script.js):
state: Obiectul central care stochează poziția, rotația și keyframe-urile cubului.init(): Funcția care "trezește" toate butoanele și sliderele la pornire.applyTransforms(): Calculează și aplică stilul CSS transform pe cub în timp real.playAnimation(): Folosește Web Animations API pentru a rula animația fluid între keyframe-uri.Mouse Interaction: Gestionează rotația (drag) și translația (Shift + drag) prin calcularea diferenței de pixeli (deltaX/Y) la mișcarea mouse-ului.